<template>
    <div>
        <el-table ref="multipleTable" :data="orderItemList" style="width: 100%" row-key="orderItemId" lazy
            @selection-change="handleSelectionChange">
            <el-table-column prop="orderId" label="订单 ID" />
            <el-table-column prop="medicineName" label="药品名" />
            <el-table-column prop="number" label="药品数量" />
        </el-table>
        <el-pagination background layout="prev, pager, next" :total="total" @prev-click="currentChange"
            @next-click="currentChange" @current-change="currentChange" />
    </div>
</template>

<script>
import { config } from '@vue/test-utils';

export default {
    name: 'OrderItemDialog',
    props: {
        orderId: Number
    },
    data() {
        return {



            orderItemList: [],

            page: 0,
            pageSize: 10,
            total: 0,

            orderItemInfo: {
                orderId: "",
                medicineName: "",
                number: "",
            },

            query: {
                orderId: "",
                medicineName: "",
                number: "",
            }
        }
    },
    created() {
        this.doSelectAll();
    },
    methods: {

        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        currentChange(index) {
            this.page = index - 1;
        },
        doSelectAll() {
            this.$store
                .dispatch("orderItem/selectAll", {
                    obj: {
                        orderId: this.query.orderId != "" ? this.query.orderId : this.orderId,
                        medicineName: this.query.medicineName
                    },
                    page: this.page,
                    pageSize: this.pageSize,
                })
                .then((res) => {
                    console.log(res.list)
                    this.orderItemList = res.list;
                    this.total = res.total;
                });
        },
        queryClear() {
            this.query = {
                orderId: "",
                medicineName: "",
                number: "",
            }
            this.doSelectAll()
        },
        prevClick() {
            this.page -= 1;
            this.doSelectAll();
        },
        nextClick() {
            this.page += 1;
            this.doSelectAll();
        },
        refresh() {
            this.orderItemInfo = {
                orderId: "",
                medicineName: "",
                number: "",
            };
            this.doSelectAll();
            this.$refs.multipleTable.clearSelection();
        },

    }
}
</script>

<style scoped>

</style>